<template>
  <div class="leftview">
<!--        <img src="../../assets/img/JHlogo.png"> -->
        <div class="quesList">
          <div>
            <p>疑似违规学校食堂数</p>
            <span class="t_num1"></span>
            </div>
          <div>
            <p>发现问题线索数</p>
            <span class="t_num2"></span>
          </div>
        </div>
  </div>
</template>

<script>
  import $ from "jquery";
  import "../../../static/js/digitalScroll.js";
  import {PatrolPlatform} from "../../request/api"
  export default {
    props:['showNew','numLeft'],
    data() {
      return {
        XCnum:0,
        Quenum:0,
        set1:'',
        set2:'',
      
      };
    },
    methods:{
      XCques(a){
        var sum1 = this.XCnum;
        let that = this;
          if(a == 1){
            show_num1(sum1,a);
          }else{
            show_num1(sum1);
            let t = parseInt(5+Math.random()*5)*1000
              that.set1 = setInterval(function() {
              show_num1(sum1);
            }, t);
          }
        function show_num1(n,a) {
        	if (sum1 <= 253) {
            // sum1 = sum1 +  Math.ceil(Math.random()*9);
            

            if(a == 1){
              
              sum1 = sum1
            }else{
              sum1 = sum1 + parseInt(Math.random()*(3-1+1)+1,10)
            }
        		var it = $(".t_num1 i");
            var len = String(n).length;
        		for (let i = 0; i < len; i++) {
        			if (it.length <= i) {
                
                $(".t_num1").append("<i></i>");
        			}
              var num1 = String(n).charAt(i);
              
        			//根据数字图片的高度设置相应的值
              var y = -parseInt(num1) * 60;
              var obj = $(".t_num1 i").eq(i);
        			obj.animate(
        				{
        					backgroundPosition:
        						"(0 " + String(y) + "px)"
        				},
        				"slow",
        				"swing",
        				function() {}
        			);
        		}
        	} else {
            sum1 = 253;
            var it = $(".t_num1 i");
            var len = String(sum1).length;
            for (let i = 0; i < len; i++) {
            	if (it.length <= i) {
            		$(".t_num1").append("<i></i>");
            	}
            	var num1 = String(sum1).charAt(i);
            	//根据数字图片的高度设置相应的值
            	var y = -parseInt(num1) * 60;
            	var obj = $(".t_num1 i").eq(i);
            	obj.animate(
            		{
            			backgroundPosition:
            				"(0 " + String(y) + "px)"
            		},
            		"slow",
            		"swing",
            		function() {}
            	);
            }
        		clearInterval(that.set1);
        	}
        }
      },
      Quexposure(a){
        let that = this;
      // console.log(that.Quenum)
      if(a == 1){
        var sum2 = 0;
      }else{
        var sum2 = this.Quenum;
      }
        // $(function() {
        // 	show_num2(sum2);
        // 	that.set2 = setInterval(function() {
        // 		show_num2(sum2);
        // 	}, 1000);
        // });
        show_num2(sum2);
        function show_num2(n) {
        	// if (sum2 <= parseInt(that.numLeft)) {
        		// sum2 = sum2 +  parseInt(Math.random()*(3-2+1)+2,10);
        		var it = $(".t_num2 i");
        		var len = String(n).length;
        		for (let i = 0; i < len; i++) {
        			if (it.length <= i) {
        				$(".t_num2").append("<i></i>");
        			}
        			var num1 = String(n).charAt(i);
        			//根据数字图片的高度设置相应的值
        			var y = -parseInt(num1) * 60;
        			var obj = $(".t_num2 i").eq(i);
        			obj.animate(
        				{
        					backgroundPosition:
        						"(0 " + String(y) + "px)"
        				},
        				"slow",
        				"swing",
        				function() {}
        			);
        		}
        	// } else {
          //   sum2 = parseInt(that.numLeft);
          //  var it = $(".t_num2 i");
          //  var len = String(sum2).length;
          //  for (let i = 0; i < len; i++) {
          //  	if (it.length <= i) {
          //  		$(".t_num2").append("<i></i>");
          //  	}
          //  	var num1 = String(sum2).charAt(i);
          //  	//根据数字图片的高度设置相应的值
          //  	var y = -parseInt(num1) * 60;
          //  	var obj = $(".t_num2 i").eq(i);
          //  	obj.animate(
          //  		{
          //  			backgroundPosition:
          //  				"(0 " + String(y) + "px)"
          //  		},
          //  		"slow",
          //  		"swing",
          //  		function() {}
          //  	);
          //  }
        		clearInterval(that.set2);
        	// }
        }
      },
      GetPatrolPlatform(){
        PatrolPlatform({
            code:'all',
            AppId:this.$getParams('appid'),
            EBCOrganizationId:'',
            UserId:this.$getParams('userid')
        }).then((res)=>{
          console.log(res)
           res.SCater.Data.PatrolPlatform_A.forEach((res)=>{
              if(res.StatType == "疑似违规学校食堂数"){
                clearInterval(this.set1)
                this.XCnum = 0
                this.XCnum = res.Num
                 // this.XCques()
              }else if(res.StatType == "问题曝光数"){
                 clearInterval(this.set2)
                 this.Quenum = 0
                this.Quenum = res.Num
                 // this.Quexposure()
              }
             })
           })
        }
    },
    created() {
     
    },
    mounted(){
      this.GetPatrolPlatform()
      this.XCques('1')
      this.Quexposure('1')
    },
    watch:{
      showNew(e){
        if(e){
          this.XCnum = 1;
          this.Quenum = 0;
          this.XCques('2');
          // this.Quexposure('1')
        }
      
      },
      numLeft(val){
        this.Quenum = this.numLeft
        this.Quexposure()
      }
    }
  };
</script>

<style>
  .leftview{
    position: absolute;
    left:50px;
    width:450px;

  }
  .leftview .quesList p{
    font-size: 40px;
        color: hsla(195, 100%, 50%, 1);
        padding-top: 80px;
  }
    .t_num1,.t_num2{
      display: block;
      margin-top: 20px;
      height: 65px;
      overflow: hidden;
    }
  .t_num1 i {
  	width: 55px;
  	height: 60px;
  	margin-right: 10px;
  	display: inline-block;
  	background: url("../../assets/img/img1.png") no-repeat;
  	background-position: 0 0;
  }
  .t_num2 i {
  	width: 55px;
  	height: 60px;
  	margin-right: 10px;
  	display: inline-block;
  	background: url("../../assets/img/img2.png") no-repeat;
  	background-position: 0 0;
  }
</style>
